<template>
    <div id="main" class="app-main">
      <keep-alive>
        <router-view :key="$route.path"></router-view>
      </keep-alive>
    </div>
</template>

<script>
// import iView from 'iview'
export default {
  mounted() {
    // let that = this
    // console.log(that.$http.interceptors);
    // that.$http.get("/api/settings/grades", response => {
    //   console.log(response);
    // });
  },
  beforeDestroy() {},
  methods: {}
}
</script>

<style lang="less">
html,
body {
  width: 100%;
  height: 100%;
}
.app-main {
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
}

header {
  background: #39f;
}
.navbar {
  a {
    color: white;
  }
  .navbar-brand {
    img {
      width: 100px;
    }
    float: left;
    padding-top: 12px;
    margin-right: 5px;
    margin-bottom: 6px;
  }
  .navbar-nav {
    &.navbar-nav-main {
      @media (min-width: 767px) {
        float: left;
      }
    }
    li {
      a {
        padding: 15px 5px;
        font-size: 14px;
        display: block;
        > i {
          margin-right: 5px;
        }
      }
      &.active,
      &:hover {
        a {
          color: white;
        }
      }
      &.nav-item {
        display: inline-block;
        a {
          padding: 15px;
        }
        &.active,
        &:hover {
          background: darken(#39f, 3%);
        }
      }
      &.toolbar-item {
        margin-left: 2px;
      }
    }
  }
}
</style>
